$(function () {

    findCuisineData();
})

function findCuisineData() {
    let res = myAjax("/cuisine/findAll", {isShow: 1}, 'get');
    if (res != null) {
        setCuisineData(res);
    }
}

function setCuisineData(data) {
    let html = '';
    for (let i = 0; i < data.length; i++) {
        html += '<div id="cuisineId' + data[i].id + '" onclick="goToProductPage(' + data[i].id + ')">' + data[i].name + '</div>';
    }
    $("#cuisine").html(html);

    let productId = sessionStorage.getItem("productId");
    findById(productId);
}

function goToProductPage(id) {
    sessionStorage.setItem("cuisineId", id);
    window.open("/html/product.html");
}

function findById(id) {
    let res = myAjax("/product/findById", {id: id}, 'get');
    if (res != null) {
        setProductData(res);
    }
}

function setProductData(data) {
    console.log(data);
    if (data.length == 1) {
        // setLast({id: 0, name: '无'});
        setLast(null);
        setThisData(data[0]);
        setNext(null);
    } else if (data.length == 2) {
        if (data[0].id == sessionStorage.getItem("productId")) {
            setLast(null);
            setThisData(data[0]);
            setNext(data[1]);
        } else {
            setLast(data[0]);
            setThisData(data[1]);
            setNext(null);
        }
    } else {
        setLast(data[0]);
        setThisData(data[1]);
        setNext(data[2]);
    }

}

function setThisData(data) {
    $("#imgHref").attr("src", data.imgHref);
    $("#productName").html(data.name);
    $("#marketPrice").html(data.marketPrice);
    $("#normalPrice").html(data.normalPrice);
    $("#content").html(data.content);
//    需要将菜系的对应颜色进行设置
//    做颜色之前，应该将以前的颜色全部删除，在重新设置
    $("#cuisine>div").each(function (e, t) {
        $(this).css({"background-color": "rgb(243, 243, 243)", "color": "black"});
        // $(this).addClass("product-style-hover");
    })
    $("#cuisineId" + data.cuisineId).css({"background-color": "rgb(230, 145, 55)", "color": "white"});
}

function setLast(data) {
    if (data == null) {
        $("#last").html('');
        return;
    }
    $("#last").html('<div>上一个</div>\n' +
        '                        <div class="font-title" onclick="findById(' + data.id + ')">' + data.name + '</div>');
}

function setNext(data) {
    if (data == null) {
        $("#next").html('');
        return;
    }
    $("#next").html('<div>下一个</div>\n' +
        '                        <div class="font-title" onclick="findById(' + data.id + ')">' + data.name + '</div>');
}